<template>
  <el-form label-position="right" label-width="80px">
    <el-row :gutter="8">
      <el-col :span="8">
        <el-form-item label="数据库" required>
          <el-select style="width: 100%" v-model="appTable.callDb" :disabled="!$Util.isEmpty(appTable.tableId)">
            <template v-for="option in appContext.envs">
              <el-option v-if="option.envType === 'db'" :key="option.envProp" :value="option.envProp" :label="option.envLabel"></el-option>
            </template>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="表名" required>
          <el-input v-model="appTable.jdbcName" placeholder="表名" :disabled="!$Util.isEmpty(appTable.tableId)"/>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="表备注">
          <el-input v-model="appTable.jdbcComment" placeholder="表备注"/>
        </el-form-item>
      </el-col>
    </el-row>
    <el-form-item v-if="!select" style="text-align: center">
      <el-button icon="el-icon-circle-check" :loading="loading" type="success" @click="saveTable(appTable)">{{ appTable.tableId ? '更新' : '创建' }}表</el-button>
      <el-button icon="el-icon-copy-document" :loading="loading" type="warning" @click="addCommon">公共字段</el-button>
    </el-form-item>
    <el-form-item label-width="0">
      <app-schema-column ref="columnRef" :app-table="appTable" :select="select" ></app-schema-column>
    </el-form-item>
  </el-form>
</template>

<script>
import AppSchemaColumn from "@/views/system/app/schema/AppSchemaColumn";
export default {
  name: "AppSchemaInfo",
  components: {AppSchemaColumn},
  inject: {
    appContext: {
      from: 'appContext',
      default: function () {
        return {}
      }
    },
    appInfo: {
      from: 'appInfo',
      default: function () {
        return undefined
      }
    }
  },
  props: {
    appTable: {
      type: Object,
      default: function () {
        return { columns: [] }
      }
    },
    select: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      loading: false,
      commonColumns: [
        { jdbcName: 'createAt', jdbcComment: '创建日期',  jdbcType: 'datetime', jdbcLength: 0, jdbcDigit: 0, jdbcNullAble: false },
        { jdbcName: 'createById', jdbcComment: '创建人ID',  jdbcType: 'varchar', jdbcLength: 20, jdbcDigit: 0, jdbcNullAble: false, jdbcDefault: 0 },
        { jdbcName: 'createByName', jdbcComment: '创建人名称',  jdbcType: 'varchar', jdbcLength: 50, jdbcDigit: 0, jdbcNullAble: false },
        { jdbcName: 'updateAt', jdbcComment: '更新日期',  jdbcType: 'datetime', jdbcLength: 0, jdbcDigit: 0, jdbcNullAble: false },
        { jdbcName: 'updateById', jdbcComment: '更新人ID',  jdbcType: 'varchar', jdbcLength: 20, jdbcDigit: 0, jdbcNullAble: false, jdbcDefault: 0 },
        { jdbcName: 'updateByName', jdbcComment: '更新人名称',  jdbcType: 'varchar', jdbcLength: 50, jdbcDigit: 0, jdbcNullAble: false },
        { jdbcName: 'branchId', jdbcComment: '部门ID',  jdbcType: 'varchar', jdbcLength: 20, jdbcDigit: 0, jdbcNullAble: false, jdbcDefault: 0 },
        { jdbcName: 'groupId', jdbcComment: '组织ID',  jdbcType: 'varchar', jdbcLength: 20, jdbcDigit: 0, jdbcNullAble: false, jdbcDefault: 0 },
      ]
    }
  },
  methods: {
    saveTable(row){
      this.loading = true
      const $table = this.$refs.columnRef
      const { dataSource } = $table
      row.columns = dataSource
      this.$post('appTable/save?appId=' + this.appInfo.appId, row)
          .then(res => {
            this.$resultMsg(this, res)
            if (res.code === 200) {
              this.$emit('refreshTab', res.data)
            }
            setTimeout(() => {
              $table.loadSource()
              this.loading = false
            }, 300)
          })
    },
    addCommon() {
      const $table = this.$refs.columnRef
      const { dataSource } = $table
      for (let i = 0; i < this.commonColumns.length; i++) {
        const comumn = this.commonColumns[i]
        const index = dataSource.findIndex(item => item.jdbcName === comumn.jdbcName)
        if (index < 0) {
          const newColumn = this.$Util.copy(comumn)
          newColumn.jdbcOrder = dataSource.length + 1
          newColumn.jdbcState = 1
          dataSource.push(newColumn)
        }
      }
      this.$resultMsg(this, { code: 200, msg: '添加成功' })
    }
  }
}
</script>

<style scoped>

</style>
